<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/component/layui/css/layui.css">
    <link rel="stylesheet" href="/css/stu-manager.css">
</head>
<body>

<div class="container">
    <div class="layui-row">
        <div class="layui-col-xs12">
            <div style="text-align: center;font-size: 50px;">学生信息管理</div>
        </div>
    </div>

    <div class="layui-row">
        <div class="layui-col-xs12 toolbar">
            <div class="layui-row">
                <!--添加弹出对话框的监听事件-->
                <button type="button"
                        class="layui-btn layui-btn-normal layui-btn-radius "
                        onclick="showStuInsertOrUpdateDialog(); return false;">
                    <i class="layui-icon layui-icon-addition">&nbsp;新增</i>
                </button>

                <button type="button" id="btn_reset"
                        class="layui-btn layui-btn-normal layui-btn-radius ">重置
                </button>

                <button type="button" id="btn_refresh" style="float: right"
                        class="layui-btn layui-btn-normal layui-btn-radius ">
                    <i class="layui-icon layui-icon-refresh">&nbsp;刷新</i>
                </button>


                <button type="button" class="layui-btn layui-bg-red layui-btn-radius
                " onclick="deleteStudentByIds();" style="float: right">
                    <i class="layui-icon layui-icon-delete">&nbsp;删除</i>
                </button>
            </div>

            <div class="queryBox">
                <form action="" class="layui-form" id="queryForm">
                    <ul class="query-inline">
                        <li class="layui-input-group">
                            <div class="layui-input-prefix">
                                学号
                            </div>
                            <input id="input_sno" name="sno" type="text" placeholder="学生学号" class="layui-input">
                            <div class="layui-input-split layui-input-suffix" style="cursor: pointer;">
                                <i class="layui-icon layui-icon-clear" id="btn_clear_sno"></i>
                            </div>

                        </li>
                        <li class="layui-input-group">
                            <div class="layui-input-prefix">
                                姓名
                            </div>
                            <input id="input_name" name="name" type="text" placeholder="学生姓名" class="layui-input">
                            <div class="layui-input-split layui-input-suffix" style="cursor: pointer;">
                                <i class="layui-icon layui-icon-clear" id="btn_clear_name"></i>
                            </div>

                        </li>
                        <li class="layui-input-group">
                            <div class="layui-input-prefix">
                                年龄
                            </div>
                            <input id="input_age" name="age" type="number" placeholder="学生年龄" class="layui-input">
                            <div class="layui-input-split layui-input-suffix" style="cursor: pointer;">
                                <i class="layui-icon layui-icon-clear" id="btn_clear_age"></i>
                            </div>

                        </li>

                        <li class="layui-input-group">
                            <div class="layui-input-prefix">
                                性别
                            </div>
                            <select id="input_sex" name="sex">
                                <option value="">请选择</option>
                                <option value="1">男</option>
                                <option value="2">女</option>
                            </select>

                        </li>

                        <li class="layui-input-group">
                            <div class="layui-input-suffix">
                                <button id="btn_query" type="button"
                                        class="layui-btn layui-btn-normal layui-btn-radius"
                                        onclick="search(false); return false;" style="margin-left: 10px">查询
                                </button>
                            </div>
                        </li>
                    </ul>
                </form>
            </div>

        </div>
    </div>

    <div class="layui-row" style="margin-top: 20px">
        <div class="layui-col-xs12">
            <table class="layui-hide" id="tbStudent" lay-filter="tbStudent"></table>
        </div>
    </div>

    <div id="formDlg" style="display: none">
        <!--表单-->
        <!-- 给容器追加 class="layui-form-pane"，即可显示为方框风格 -->
        <form class="layui-form layui-form-pane dialog-container" id="StuForm">
            <div class="layui-form-item" id="stu-form-id">
                <label class="layui-form-label">id</label>
                <div class="layui-input-block">
                    <input type="text" name="id" id="id" autocomplete="off" placeholder="请输入学生id"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">

                <label class="layui-form-label">姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="name" id="name" placeholder="请输入学生姓名" autocomplete="off"
                           class="layui-input">
                </div>

            </div>
            <div class="layui-form-item">

                <label class="layui-form-label">年龄</label>
                <div class="layui-input-block">
                    <input type="text" name="age" id="age" placeholder="请输入学生年龄" autocomplete="off"
                           class="layui-input">
                </div>

            </div>
            <div class="layui-form-item">

                <label class="layui-form-label">学号</label>
                <div class="layui-input-block">
                    <input type="text" name="sno" id="sno" placeholder="请输入学号(必填)" autocomplete="off"
                           lay-verify="required" class="layui-input">
                </div>

            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <!--type="password" 密码样式，隐藏内容-->
                    <input type="text" name="password" id="password" placeholder="请输入密码(必填)"
                           lay-verify="required"
                           autocomplete="off"
                           class="layui-input">
                </div>
            </div>


            <div class="layui-form-item" pane>
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                    <input type="radio" name="sex" value="1" title="男" checked>
                    <input type="radio" name="sex" value="2" title="女">
                </div>
            </div>

            <!--表单提交按钮，使用lay-submit lay-filter来声明-->
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="stu-form-submit" id="btn-stu-confirm">
                    确定
                </button>
            </div>
        </form>
    </div>


</div>


</div>

<script type="text/html" id="editTemplate">
    <div class="layui-clear-space">
        <button type='button' class='layui-btn layui-btn-sm layui-btn-primary layui-btn-radius layui-bg-blue'>
            <i class='layui-icon layui-icon-edit ' lay-event="edit" id="btn_edit">&nbsp;编辑</i>
        </button>
    </div>
</script>

<script src="/component/layui/layui.js"></script>
<script src="/myjs/student/ajax-manage.js"></script>
</body>
</html>